<template>
    <div class="pageThree">
   <div class="heard">
        <!-- <div>
            <img class="heard-img"  src="../../../../../static/engineering5188/homPage/CompanyIcon.png" />
        </div>
        <div class="right">
            <div  class="right-img" >
                <img   src="../../../../../static/engineering5188/homPage/loginIcon.png" />
            </div>
            <div  class="loginText">
                <router-link class="loginText" to="/newLogin">登录</router-link> | <router-link class="loginText" to="/newLogin">注册</router-link>
            </div>
        </div> -->
   </div>

 <!-- <div class="middle">
    <div class="middleText">线上海事展</div>
    <div class="endText">MARINTEC ONLINE</div>
 </div> -->



 <div class="round">
  

   <div class="roundSmall">
    <div class="roundSmallTwo">
     
    </div>
    </div>

    <div class="roundSmall">
    <div class="roundSmallTwo">
     
    </div>
    </div>


    <div class="roundBig">
    <div class="roundBigOne">
     
    </div>
   </div>

 </div>



<!-- 底部footer -->
<!-- <div class="footerStype" >
Copyright © 2024 线上海事展 All Rights Reserved.    京公网安备11010602005977号   |   蜀ICP备11019833号
</div> -->

</div>



</template>
<script>

export default {
name: "newHomePageThree",
components: {
    
},
data() {
  return {
    contentData:[
        //{
        //    id:0,
        //    text:"注册登录",
        //    img:require("../../../../../static/engineering5188/homPage/zcIcon.png"),
        //    content:"注册成会员，优先享受更多权益，为您提供专业化、个性化的服务。",
        //    typeText:"立即加入"
        //},
        //{
        //    id:1,
        //    text:"展示搜索",
        //    img:require("../../../../../static/engineering5188/homPage/chuanIcon.png"),
        //    content:"实施海洋强国战略，发展优质生产力，推进船舶工业转型升级，搭建国内外海事行业深层次合作平台的线上展览。",
        //    typeText:"立即加入"
        //},
        //{
        //    id:2,
        //    text:"排行指数",
        //    img:require("../../../../../static/engineering5188/homPage/phIcon.png"),
        //    content:"基于多个维度的数据和指标来为用户提供优质的供应商和商品选择。",
        //    typeText:"立即加入"
        //}, {
        //    id:3,
        //    text:"定制服务",
        //    img:require("../../../../../static/engineering5188/homPage/free.png"),
        //    content:"待开放",
        //    typeText:"立即加入"
        //}
    ]
  };
},
computed: {
 
},
watch: {},
created() {
 
},
methods: {
    jumpFunc(){
          this.$router.push("/newLogin")
        }
 
},
};
</script>

<style scoped lang="less">
.rightIconDiv{
padding-left: 4px;
img{
width: 20px;
height: 20px;
}
}
.HeardImg{
width: 48px;
height: 48px;
}

.footerStype{
margin-top: 145px;color: aqua;
height: 67px;width: 100%;
text-align: center;
border-top:  0.5px solid #D3D8DE;
opacity: 0.3;font-family: Arial, Arial;
font-weight: 400;
font-size: 12px;
color: #FFFFFF;
line-height: 67px;
font-style: normal;
text-transform: none;
}

.right-img{

padding-right: 10px;
img{
 width: 24px;
 height: 24px;
}

}
.heard-img{
width: 204px;
height: 60px;
}



.pageThree{
width: 100%;
height: 100%;
background-image: url("../../../../../static/engineering5188/homPage/homeBgThree.png") ;
background-size: 100% 100%;
/* 背景图片不重复 */
background-repeat: no-repeat;
/* 背景图片居中显示 */
background-position: center center;
.heard{
    width: 1540px;
    
    margin: auto;
    display: flex;
    justify-content: space-between;
    height: 96px;
    padding-top: 31px;
    .right{
        display: flex;
        /* 垂直居中子元素 */
     align-items: center; 
     .loginText{
        font-family: Microsoft YaHei, Microsoft YaHei;
        font-weight: 400;
        font-size: 14px;
         color: #FFFFFF;
         line-height: 23px;
         text-align: left;
        font-style: normal;
         text-transform: none;
        -webkit-text-stroke: 1px rgba(0,0,0,0);
     }
    }
}
.middle{
  margin-top: 196px;
  margin-left: 280px;
    .middleText{
font-family: Arial Black, Arial Black;
font-weight: 400;
font-size: 88px;
color: #FFFFFF;
font-style: normal;
text-transform: none;
-webkit-text-stroke: 1px rgba(0,0,0,0);
}
.endText{
    
font-family: Arial Black, Arial Black;
font-weight: 400;
font-size: 48px;
color: #FFFFFF;
font-style: normal;
text-transform: none;
-webkit-text-stroke: 1px rgba(0,0,0,0);
}
}
.round{
    margin-top:503px;
margin-left: 270px;
display: flex;
 /* 垂直居中子元素 */
 align-items: center; 
.roundBig{
    width: 20px;
height: 20px;
border: 1px solid #FFFFFF;
border-radius: 50%;
display: grid;
place-items: center;
.roundBigOne{
width: 8px;
height: 8px;
background: #FFFFFF;
border-radius: 50%;
}
}

.roundSmall{
width: 14px;
height: 14px;
border: 1px solid #FFFFFF;
border-radius: 50%;
opacity: 0.3;
display: grid;
place-items: center;
margin-right: 32px;
.roundSmallTwo{
    width: 8px;
height: 8px;
background: #FFFFFF;
border-radius: 50%;
}
}




}






}
</style>


